@IOS7_RADIONBUTTON_ICON_SIZE: 32px;

.dx-radiobutton-icon {
    position: relative;
    width: @IOS7_RADIONBUTTON_ICON_SIZE;
    height: @IOS7_RADIONBUTTON_ICON_SIZE;

    .dx-radiobutton-checked & {
        .dx-radiobutton-icon-dot {
            position: absolute;
            width: @IOS7_RADIONBUTTON_ICON_SIZE/2;
            height: @IOS7_RADIONBUTTON_ICON_SIZE/2;
            left: @IOS7_RADIONBUTTON_ICON_SIZE/4;
            top: @IOS7_RADIONBUTTON_ICON_SIZE/4;
            background: @IOS7_RADIOGROUP_BACKGROUND_COLOR;
            .box-shadow(~"0 1px 1px rgba(0, 0, 0, 0.1)");
            .border-radius(50%);
        }

        &:before {
            background: @IOS7_RADIOGROUP_CHECK_BACKGROUND_COLOR;
            .box-shadow(none);
        }
    }

    &:before {
        position: absolute;
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        background-color: @IOS7_RADIOGROUP_BACKGROUND_COLOR;
        .box-shadow(0 0 2px rgba(170,170,170,.6) inset);
        .border-radius(50%);
    }

    .dx-state-disabled & {
        opacity: @IOS7_DISABLED_OPACITY;
    }
}

.dx-state-disabled {
    &.dx-radiobutton {
        opacity: 1;
    }
}

.dx-state-active {
    &.dx-radiobutton .dx-radiobutton-icon:before {
        background-color: @IOS7_RADIOGROUP_CHECK_BACKGROUND_COLOR;
    }
}


.dx-invalid {
    .dx-radiobutton-icon:before {
        border: 1px solid @IOS7_FADED_INVALID_COLOR;
    }

    .dx-state-focused {
        .dx-radiobutton-icon:before {
            border-color: @IOS7_INVALID_COLOR;
        }
    }
}
